import {
  CalendarOutlined,
  CheckCircleOutlined,
  EditOutlined,
  FileOutlined,
  FormOutlined,
  NumberOutlined,
  PictureOutlined,
  TableOutlined,
} from '@ant-design/icons'

/** 表单项类型定义 */
export const FORM_ITEM_TYPES = {
  INPUT: 'input',
  TEXTAREA: 'textarea',
  NUMBER: 'number',
  SELECT: 'select',
  MULTI_SELECT: 'multiSelect',
  DATE: 'date',
  DATE_RANGE: 'dateRange',
  IMAGE_UPLOAD: 'imageUpload',
  FILE_UPLOAD: 'fileUpload',
  TABLE: 'table',
}

/** 表单项列表 */
export const formItemList = [
  {
    type: FORM_ITEM_TYPES.INPUT,
    aekComName: 'Input',
    title: '单行输入框',
    icon: <FormOutlined />,
    properties: {
      placeholder: '请输入',
    },
  },
  {
    type: FORM_ITEM_TYPES.TEXTAREA,
    aekComName: 'AekTextArea',
    title: '多行输入框',
    icon: <EditOutlined />,
    properties: {
      placeholder: '请输入',
    },
  },
  {
    type: FORM_ITEM_TYPES.NUMBER,
    aekComName: 'AekInputNumber',
    title: '数字输入框',
    icon: <NumberOutlined />,
    properties: {
      placeholder: '请输入数字',
      min: undefined,
      max: undefined,
    },
  },
  {
    type: FORM_ITEM_TYPES.SELECT,
    aekComName: 'Select',
    title: '单选下拉',
    icon: <CheckCircleOutlined />,
    properties: {
      placeholder: '请选择',
      options: [
        { key: 1, label: '选项1', value: '选项1' },
        { key: 2, label: '选项2', value: '选项2' },
        { key: 3, label: '选项3', value: '选项3' },
      ],
    },
  },
  {
    type: FORM_ITEM_TYPES.MULTI_SELECT,
    aekComName: 'Select',
    title: '多选下拉',
    icon: <CheckCircleOutlined />,
    properties: {
      mode: 'multiple',
      placeholder: '请选择',
      options: [
        { key: 1, label: '选项1', value: '选项1' },
        { key: 2, label: '选项2', value: '选项2' },
        { key: 3, label: '选项3', value: '选项3' },
      ],
    },
  },
  {
    type: FORM_ITEM_TYPES.DATE,
    aekComName: 'DatePicker',
    title: '日期',
    icon: <CalendarOutlined />,
    properties: {
      placeholder: '请选择日期',
    },
  },
  {
    type: FORM_ITEM_TYPES.DATE_RANGE,
    aekComName: 'RangePicker',
    title: '日期区间',
    icon: <CalendarOutlined />,
    properties: {
      placeholder: ['开始日期', '结束日期'],
    },
  },
  {
    type: FORM_ITEM_TYPES.IMAGE_UPLOAD,
    aekComName: 'AekUpload',
    title: '上传图片',
    icon: <PictureOutlined />,
    properties: {
      fileType: 'img',
      listType: 'picture-card',
      notUpLoad: true,
    },
  },
  {
    type: FORM_ITEM_TYPES.FILE_UPLOAD,
    aekComName: 'AekUpload',
    title: '上传附件',
    icon: <FileOutlined />,
    properties: {
      notUpLoad: true,
    },
  },
  // {
  //   type: FORM_ITEM_TYPES.TABLE,
  //   title: '表格',
  //   icon: <TableOutlined />,
  //   properties: {
  //     columns: [
  //       { title: '字段1', dataIndex: 'field1', key: 'field1' },
  //       { title: '字段2', dataIndex: 'field2', key: 'field2' },
  //     ],
  //     dataSource: [],
  //   },
  // },
].map(({ type, aekComName, title, icon, properties }) => ({
  id: `field_${type}`,
  type,
  aekComName,
  title,
  icon,
  properties: {
    ...properties,
    label: title,
    required: false,
    width: '100%',
  },
}))
